{include file="public/header" /}
<div class="layui-fluid">
	<div class="layui-row layui-col-space15">
		<div class="layui-col-md12">
			<div class="layui-col-md12 layui-col-space15">
				<div class="layui-col-md4">
					<div class="layui-card">
						<div class="layui-card-header">今日概况</div>
						<div class="layui-card-body">
							<div class="layui-carousel layadmin-carousel layadmin-backlog">
								<div carousel-item>
									<ul class="layui-row layui-col-space10">
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3>今日注册量</h3>
												<p><cite>{$data.zhuce_count}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3>今日放款量</h3>
												<p><cite>{$data.fangkuan_count}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3>今日借款金额</h3>
												<p><cite style="color: #FF5722;">{$data.jiekuan_money}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3>今日实付金额</h3>
												<p><cite style="color: #FF5722;">{$data.shifu_money}</cite></p>
											</a>
										</li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-md5">
					<div class="layui-card">
						<div class="layui-card-header">今日借款申请</div>
						<div class="layui-card-body">
							<div class="layui-carousel layadmin-carousel layadmin-backlog">
								<div class="layui-carousel layadmin-carousel layadmin-backlog">
									<div carousel-item>
										<ul class="layui-row layui-col-space10">
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3>借款申请量</h3>
													<p><cite>{$data.shenqing_count}</cite></p>
												</a>
											</li>
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3>新客申请量</h3>
													<p><cite>{$data.shenqing_count_xinke}</cite></p>
												</a>
											</li>
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3>复借申请量</h3>
													<p><cite>{$data.shenqing_count_laoke}</cite></p>
												</a>
											</li>
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3 style="white-space:nowrap">借款申请金额</h3>
													<p><cite style="color: #FF5722;">{$data.shenqing_money}</cite>
													</p>
												</a>
											</li>
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3 style="white-space:nowrap">新客申请金额</h3>
													<p><cite style="color: #FF5722;">{$data.shenqing_money_xinke}</cite>
													</p>
												</a>
											</li>
											<li class="layui-col-xs4">
												<a class="layadmin-backlog-body">
													<h3 style="white-space:nowrap">复借申请金额</h3>
													<p><cite style="color: #FF5722;">{$data.shenqing_money_laoke}</cite>
													</p>
												</a>
											</li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-md3">
					<div class="layui-card">
						<div class="layui-card-header">
							今日订单概况</div>
						<div class="layui-card-body">
							<div class="layui-carousel layadmin-carousel layadmin-backlog">
								<div carousel-item>
									<ul class="layui-row layui-col-space10">
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3 lay-tips="(今日申请人数/今日注册人数)*100%">申请率?</h3>
												<p><cite>{$dataLv.sqLv}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3 lay-tips="(今日通过订单数/今日总借款订单数)*100%">通过率?</h3>
												<p><cite>{$dataLv.tgLv}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3 lay-tips="(今日放款订单数/今日总借款订单数)*100%">放款率?</h3>
												<p><cite style="color: #FF5722;">{$dataLv.fkLv}</cite></p>
											</a>
										</li>
										<li class="layui-col-xs6">
											<a class="layadmin-backlog-body">
												<h3 lay-tips="(今日复借单数/今日总借款订单数)*100%">复借率?</h3>
												<p><cite style="color: #FF5722;">{$dataLv.fjLv}</cite></p>
											</a>
										</li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div class="layui-row layui-col-space15">
		<div class="layui-col-md12">
			<div class="layui-col-md12 layui-col-space15">
				<div id="container1" class="layui-col-md6 layui-col-xs12" style="height:450px;"></div>
				<div id="container2" class="layui-col-md6 layui-col-xs12" style="height:450px;"></div>
			</div>
		</div>
	</div>
</div>

{include file="public/footer" /}

<script type="text/javascript">
	$.ajax({
		url: "{:url('admin/sum/indexSum')}",
		success: function (res) { // 接口调用成功回调函数
			if (res.code == 200) {

				//注册数统计表
				Highcharts.chart('container1', {
					chart: {
						backgroundColor: {
							linearGradient: [0, 0, 0, 500],
							stops: [
								[0, 'rgb(255, 255, 255)'],
								[1, 'rgb(95, 184, 120)']
							],
						},
						type: 'areaspline',
					},
					tooltip: {
						headerFormat: '{point.key}<table>',
						pointFormat: '<tr><td style="color: {series.color}">{series.name}: </td>' +
							'<td style="text-align: right"><b>{point.y}</b></td></tr>',
						footerFormat: '</table>',
						shared: true,
						useHTML: true
					},
					title: {
						text: '近15天注册量/订单量'
					},
					subtitle: {
						text: '近15天的用户注册量 申请订单 放款订单 还款订单'
					},
					legend: {
						align: 'center',//图例居中
						verticalAlign: 'top',////图例居上
					},
					xAxis: {
						categories: res.data.time,
						type: 'datetime',
						dateTimeLabelFormats: {
							day: '%e of %b'
						},
						labels: {
							rotation: -30
						}
					},
					yAxis: {
						title: {
							text: '数量/个',
						},
						gridLineColor: '#197F07'
					},
					series: res.data.num
				});

				//金额统计表
				Highcharts.chart('container2', {
					chart: {
						backgroundColor: {
							linearGradient: [0, 0, 0, 500],
							stops: [
								[0, 'rgb(255, 255, 255)'],
								[1, 'rgb(255, 180, 0)']
							],
						},
						type: 'column'
					},
					title: {
						text: '近15天贷款金额数据'
					},
					subtitle: {
						text: '近15天的申请金额 放款金额 还款金额'
					},
					xAxis: {
						categories: res.data.time,
						crosshair: true
					},
					yAxis: {
						min: 0,
						title: {
							text: '金额/元'
						},
						gridLineColor: '#FF5722'
					},
					tooltip: {
						// head + 每个 point + footer 拼接成完整的 table
						headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
						pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
							'<td style="padding:0"><b>{point.y:.2f} ¥</b></td></tr>',
						footerFormat: '</table>',
						shared: true,
						useHTML: true
					},
					legend: {
						align: 'center',//图例居中
						verticalAlign: 'top',////图例居上
					},
					series: res.data.money
				});
			}
		}
	});
</script>